<template>
  <section class="box">
    <div class="inner">
      <h1 class="cover-heading">Building</h1>
    </div>
  </section>
</template>

<script>
import dayjs from 'dayjs'
import copy from 'copy-to-clipboard'
import countTo from '~/components/count-to.vue'
export default {
  components: {
    countTo
  },
  data() {
    return {
      showToast: false,
      time: 0,
      code: '7132021'
    }
  },
  mounted() {},
  beforeDestroy() {},
  methods: {
    copy() {
      copy(this.code)
      this.showToast = true
      this.time = setTimeout(() => {
        this.showToast = false
      }, 1500)
    }
  }
}
</script>

<style lang="less" scoped>
@import url('~assets/css/page-layout.less');

/* 超小屏幕（手机，小于 768px） */
/* 没有任何媒体查询相关的代码，因为这在 Bootstrap 中是默认的（还记得 Bootstrap 是移动设备优先的吗？） */
.box {
  img {
    margin: 0 auto;
    max-height: 65%;
    max-width: 80%;
  }
}
.toast {
  position: absolute;
  top: 2%;
  width: 200px;
  left: 40%;
  color: red;
}

/* 小屏幕（平板，大于等于 768px） */
@media (min-width: 768px) {
}

/* 中等屏幕（桌面显示器，大于等于 992px） */
@media (min-width: 992px) {
}

/* 大屏幕（大桌面显示器，大于等于 1200px） */
@media (min-width: 1200px) {
}
</style>
